//Page Object

Page({
  data: {
    inited:false,
    show:false,
    duration: 500,
    status:'',
    animationData: {}
  },

  
  //options(Object)
  onLoad: function(){
    
    
  },
  toggle(){
    let oldValue = this.data.show
    let newValue = !oldValue
    this.setData({
      show:newValue
    },()=>{
      this.observeShow(newValue,oldValue)
    })
    
  },
  observeShow(value: boolean, old: boolean) {
    if (value === old) {
      return;
    }
    value ? this.fadeUp() : this.fadeDown();
  },
  fadeUp(){
    this.setData({
      inited:true
    })
    const animation = wx.createAnimation({
      duration: 1000,
      timingFunction: 'ease',
    })

    animation.opacity(1).translateY(0).step()
    this.setData({
      animationData: animation.export()
    })
  },
  fadeDown(){
    console.log('fadeDown')
    const animation = wx.createAnimation({
      duration: 1000,
      timingFunction: 'ease',
    })
    animation.opacity(0).translateY(100).step()
    this.setData({
      animationData: animation.export()
    })
    setTimeout(() => {
      this.setData({
        inited:false
      })
    },1000)
  },
  onAnimationEnd(){
    console.log('onAnimationEnd')
    this.setData({
      inited:false
    })
  }
  
});